<template>
	<view>
		<!-- 头部导航 -->
		  <uni-nav-bar background-color="#3286ed" :statusBar="true" :fixed='true' color="#fff" title="仓库管理" left-icon="left" right-text="新增" @clickLeft="backFn"     @clickRight="addFn"></uni-nav-bar>
	   
	   <!-- 筛选功能 -->
	   <view style="position: fixed;z-index: 100;width:100%;">
	       <uni-row class="demo-uni-row">
	           <uni-col :span="11">
	               <!-- 筛选组件-->
	               <zb-dropdown-menu style="width: 100%" z-index="12">
	                   <zb-dropdown-item v-model="formData.warehouseName"  :options="option" @change="changeFn1">
	                   </zb-dropdown-item>
	               </zb-dropdown-menu>
	           </uni-col>
	           <uni-col :span="2">
	            <view class="title" style="color:#c3c3c3">|</view>
	           </uni-col>
	           <uni-col :span="11">
	               <zb-dropdown-menu style="width: 100%" z-index="12">
	                   <zb-dropdown-item v-model="formData.region"  :options="option2" @change="changeFn2">
	                   </zb-dropdown-item>
	               </zb-dropdown-menu>
	           </uni-col>
	       </uni-row>
	   </view>
	   <view style="width:100%;height: 88rpx;display: block"></view>
	   
	   
	<!-- 列表 -->
	<u-swipe-action  :autoClose='true' >
				  <view   v-for="item in list" :key="item.id">
					    <u-swipe-action-item :disabled="disabledShow"  :options="options1" @click="delBtn" :name="item.id">
							<view class="application"  @click="toInfo(item.id)" >
								<view class="application_one">{{item.warehouseName}}</view>
								<view class="desc">仓库编号：{{item.warehouseNo}}</view>
								<view class="desc">负责部门：{{item.responsibleDeptName}}</view>
								 <view class="desc">地址：{{item.address}}</view>
							</view>
						</u-swipe-action-item>
						
				  </view>
	</u-swipe-action>
	
	<!-- 消息提示 -->
	<u-toast ref="uToast"></u-toast>
	</view>
</template>
<script>
	import {listWarehouse,delWarehouse} from '@/api/warehouse/warehouse.js'
	import {provinceNameList} from '@/api/region/region.js'
	export default {
		data() {
			return {
					disabledShow:true,//右滑删除得
					options1:[{
						 text: '删除'
					}],
				list:[],
				formData:{
					pageNum:1,
					pageSize:10,
					warehouseName:'',
					regionId:'',
					region:''
					
				},
				total:0,
				option:[
					{text: '所有仓库',
                        value: ''},
				],
				option2:[
					{text: '所有地区',
					    value: ''},
				]
			};
		},
		onLoad(){
			this.initData()
			this.getProvince()
			
			// 控制删除按钮权限出现
			if (this.permissions.includes('*:*:*') || this.permissions.includes('module:warehouse:remove')) {
			    this.disabledShow = false
			}
		},
		// 上划
		onReachBottom() {
			 if(this.formData.pageSize*this.formData.pageNum<this.total){
				 this.formData.pageNum++
				 let res=listWarehouse(this.formData).then(reponse=>{
				 			 this.list.push(...reponse.rows)
							  console.log(this.list);
				 })
				
			 }else{
				 console.log('已经加载完毕');
			 }
		},
		// 下拉
		async onPullDownRefresh() {
			this.list=[]
			this.formData={
				pageNum:1,
				pageSize:10,
				 
				
			}
			await this.initData()
			setTimeout(()=>{
				uni.stopPullDownRefresh()
			},2000)
		},
		methods:{
			
			
			async initData(){
				let res=await listWarehouse(this.formData)
				this.list=res.rows
				this.total=res.total
				console.log(this.list);
				let newArr=[]
				res.rows.map(item=>{
					let obj={
						text:item.warehouseName,
						value:item.warehouseName
					}
					newArr.push(obj)
				})
				// console.log(arr);
				// console.log(newArr);
			   this.option=this.option.concat(newArr)
				
			},
			changeFn1(e){
				console.log(e);
				this.formData.warehouseName=e.value
				this.initData()
				
			},
			changeFn2(e){
				console.log(e);
				this.formData.region=e.value
				this.initData()
			},
		
			
			// 获取所有地区
			getProvince(){
					
				provinceNameList().then(res=>{
					// console.log(res);
					let arr=[]
					res.rows.map(item=>{
						let obj={
							text:item.label,
							value:item.label
						}
						arr.push(obj)
					})
					this.option2=this.option2.concat(arr)
					// console.log(this.option2);
				})
			},
			
			
			// 返回上一级
			backFn(){
				 uni.navigateBack({delta:1})
			},
			// 到详情页
			toInfo(val){
				console.log(val);
				uni.redirectTo({
					url:'/pages/WareHouse/warehouseInfo/warehouseInfo?id='+val
				})
			},
			addFn(){
				uni.redirectTo({
					url:'/pages/WareHouse/addWarehouse/addWarehouse'
				})
			},
			// 删除
			async delBtn(e){
				await delWarehouse(e.name)
				this.$refs.uToast.show({
					message:'删除成功！',
				})
				this.initData()
			},
		}
	}
</script>

<style lang="scss">
	// 下拉选择框
	.demo-uni-row {
	    margin-bottom: 10px;
	    // position: fixed;
	    /* QQ、字节小程序文档写有 :host，但实测不生效 */
	    /* 百度小程序没有 :host，需要设置block */
	    /* #ifdef MP-TOUTIAO || MP-QQ || MP-BAIDU */
	    display: block;
	    /* #endif */
	
	    .title {
	        height: 48px;
	        line-height: 48px;
	        background-color: #ffffff;
	        text-align: center;
	        font-size: 16px;
	    }
	}
	
.application{
		  position: relative;
		  min-height: 50px;
		  padding: 10px;
		  margin: 10px 5px;
		  background-color: #fff;
		  border: solid 1px #c3c3c3;
		  .application_one{
			  font-size: 16px;
			  font-weight: 600;
			  padding-bottom: 8px;
		  }
		  .desc{
			  font-size: 12px;
			  color:#8c8b8a;
			 .desc_text{
				 color: #fd9540;
			 }
		  }
		  .addapplicaionChild{
			  position: absolute;
			  right: 20px;
			  bottom: 20px;
			  font-size: 5px;
			  color: #fd9540;
		  }
		  
	  }
</style>
